/* Tailwind CSS 基础样式 */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* 全局样式重置 - 与Ant Design兼容 */
@layer base {
  html {
    font-family: 'Inter', system-ui, sans-serif;
  }
  
  body {
    @apply bg-gray-50 text-gray-900;
    margin: 0;
    padding: 0;
    line-height: 1.6;
  }

  /* 自定义组件样式 */
  .ant-card {
    @apply shadow-soft border-0;
  }
  
  .ant-card-head {
    @apply border-b border-gray-100;
  }
  
  .ant-card-body {
    @apply p-6;
  }
}

/* 自定义组件样式 */
@layer components {
  /* 校园风格按钮 */
  .btn-campus {
    @apply px-6 py-3 bg-primary-500 text-white font-medium rounded-xl 
           hover:bg-primary-600 active:bg-primary-700 
           focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-opacity-50
           transition-all duration-200 ease-in-out shadow-sm hover:shadow-md;
  }
  
  .btn-campus-secondary {
    @apply px-6 py-3 bg-secondary-400 text-gray-900 font-medium rounded-xl 
           hover:bg-secondary-500 active:bg-secondary-600 
           focus:outline-none focus:ring-2 focus:ring-secondary-400 focus:ring-opacity-50
           transition-all duration-200 ease-in-out shadow-sm hover:shadow-md;
  }
  
  /* 校园风格卡片 */
  .card-campus {
    @apply bg-white rounded-xl shadow-soft border border-gray-100 
           hover:shadow-medium transition-shadow duration-200;
  }
  
  /* 统计卡片样式 */
  .stat-card {
    @apply bg-gradient-to-br from-primary-50 to-blue-50 rounded-xl 
           p-6 shadow-soft border border-primary-100;
  }
  
  /* 页面标题样式 */
  .page-title {
    @apply text-3xl font-bold text-gray-900 mb-6 bg-gradient-to-r 
           from-primary-600 to-blue-600 bg-clip-text text-transparent;
  }
  
  /* 功能特色列表样式 */
  .feature-list {
    @apply space-y-3;
  }
  
  .feature-item {
    @apply flex items-center space-x-3 text-gray-700 hover:text-primary-600 
           transition-colors duration-200;
  }
  
  /* 响应式网格布局 */
  .responsive-grid {
    @apply grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6;
  }
  
}

/* 自定义工具类 */
@layer utilities {
  /* 校园背景渐变 */
  .bg-campus-gradient {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 50%, #bae6fd 100%);
  }
  
  /* 文字阴影效果 */
  .text-shadow {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  }
  
  /* 边框渐变 */
  .border-gradient {
    border: 2px solid transparent;
    background: linear-gradient(white, white) padding-box,
                linear-gradient(135deg, #0ea5e9, #6366f1) border-box;
  }
}

/* 响应式断点适配 */
@media (max-width: 640px) {
  .page-title {
    @apply text-2xl;
  }
  
  .btn-campus {
    @apply px-4 py-2 text-sm;
  }
}

@media (max-width: 768px) {
  .responsive-grid {
    @apply grid-cols-1 gap-4;
  }
}